<template>
	<view>
		<fui-sticky>
			<!-- #ifdef H5 -->
			<fui-nav-bar :title="title" @leftClick="leftClick">
				<fui-icon name="arrowleft"></fui-icon>
			</fui-nav-bar>
			<!-- #endif -->

		<!-- 选项卡 -->
		</fui-sticky>
		<fui-tabs :tabs="tabs" center :current="current" @change="change"></fui-tabs>
		<mescroll-body @init="mescrollInit" @down="downCallback" @up="upCallback">
			<cardAdmin :list="goods" :name="name" :type="publish_type" :category_id="category_id">
			</cardAdmin>
		</mescroll-body>
	</view>
</template>

<script setup>
	const articleApi = uniCloud.importObject('qc-article', {
		customUI: true // 取消自动展示的交互提示界面
	})
	import cardAdmin from '@/components/cardAdmin/cardAdmin.vue'
	import { LoginStore } from "@/store/modules/login.js";
	import { ref, reactive, computed } from 'vue'
	const userInfo = computed(() => (LoginStore().userInfo))
	import useMescroll from "@/uni_modules/mescroll-uni/hooks/useMescroll.js";
	import { onLoad, onReachBottom, onPageScroll, onNavigationBarButtonTap } from "@dcloudio/uni-app";

	const title = ref() //标题
	const goods = ref([]) //数据
	const publish_type = ref(null) //分类
	const category_id = ref(null) //分类id
	const name = ref() //分类名称
	onLoad(async (e) => {
		let item = JSON.parse(e.item)
		publish_type.value = item.publish_type
		switch (publish_type.value) {
			case "0":
				title.value = "文章管理"
				break;
			case "1":
				title.value = "应用管理"
				break;
			case "3":
				title.value = "应用管理"
				break;
				// #ifdef APP-PLUS
				console.log(title.value)
				uni.setNavigationBarTitle({
					title: "111"
				});
				// #endif
		}
		category_id.value = item.category_id
		name.value = item.name
		uni.$on('resetUpScroll', () => {
			getMescroll().resetUpScroll()
		})
	})
	// 返回上一层
	// #ifdef H5 
	const leftClick = () => {
		uni.navigateBack()
	}
	// #endif

	const change = (e) => {
		current.value = e.index
		getMescroll().resetUpScroll()
	}
	let current = ref(0)
	let tabs = ['全部', '显示中', '审核中', '审核失败']
	// 分页
	const {
		mescrollInit,
		downCallback,
		getMescroll
	} = useMescroll(onPageScroll, onReachBottom)
	const upCallback = async (mescroll) => {
		try {
			let params = {
				pageNum: mescroll.num,
				pageSize: mescroll.size,
				user_id: userInfo?.value?._id,
				publish_type: publish_type.value,
				release_status: current.value
			}
			const res = await articleApi.getUserAd(params)
			const curPageData = res.data || [] // 当前页数据
			if (mescroll.num == 1) goods.value = []; // 第一页需手动制空列表
			goods.value = goods.value.concat(curPageData); //追加新数据
			//方法一(推荐): 后台接口有返回列表的总页数 totalPage
			mescroll.endBySize(curPageData.length, res.total); //必传参数(当前页的数据个数, 总页数)
		} catch (e) {
			mescroll.endErr(); // 请求失败, 结束加载
		}
	}
</script>

<style lang="scss" scoped>
	.bald-bg {
		align-items: flex-start;
		display: flex;
		justify-content: space-between;
		border-radius: 20rpx;
		width: 92vw;
		min-height: 150rpx;
		padding: 32rpx;
		background: url('@/static/image/my/moneyBg.png');
		background-repeat: no-repeat;
		background-size: contain;
		background-position: center top;
		background-size: 100% 100%;
	}
</style>